<%--
  Created by IntelliJ IDEA.
  User: 萌萌居家好男人
  Date: 2021/11/1
  Time: 20:25
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <meta charset="utf-8">
    <title>客户信息管理界面</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/ui/layui-v2.6.3/css/layui.css" media="all">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/public.css" media="all">
    <!-- Bootstrap -->
    <link rel="stylesheet" href="${pageContext.request.contextPath}/bootstrap/css/bootstrap.min.css" >
    <!---->
    <!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
    <script src="${pageContext.request.contextPath}/js/jquery.1.12.3.js" ></script>
    <script src="${pageContext.request.contextPath}/ui/twbsPagination/jquery.twbsPagination.min.js" ></script>
    <%--<jsp:include page="/WEB-INF/views/link.jsp" />--%>
</head>
<body>
<h2 style="color: blueviolet">
    欢迎:${successAdmin.name}登录系统 &nbsp;&nbsp;
    <a href="${pageContext.request.contextPath}/admin?method=logout">退出登录</a></h2>
<div class="layuimini-container">
    <div class="layuimini-main">

        <fieldset class="table-search-fieldset">
            <legend>搜索信息</legend>
            <div style="margin: 10px 10px 10px 10px">
                <form class="layui-form layui-form-pane" action="${pageContext.request.contextPath}/customer" method="get" id="searchForm">
                    <input type="hidden" name="pageNo" id="currentPage" value="1">
                    <input type="hidden" name="pageSize"  value="5">
                    <input type="hidden" name="method"  value="showList">
                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <label class="layui-form-label">客户姓名</label>
                            <div class="layui-input-inline">
                                <input type="text" name="name" autocomplete="off" class="layui-input" value="${queryMap.name}">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">身份证号</label>
                            <div class="layui-input-inline">
                                <input type="text" name="idnumber" autocomplete="off" class="layui-input" value="${queryMap.idnumber}">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">性别</label>
                            <div class="layui-input-inline">
                                <input type="text" name="sex" autocomplete="off" class="layui-input" value="${queryMap.sex}">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">城市</label>
                            <div class="layui-input-inline">
                                <input type="text" name="city" autocomplete="off" class="layui-input" value="${queryMap.city}">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">电话号码</label>
                            <div class="layui-input-inline">
                                <input type="number" name="phone" autocomplete="off" class="layui-input" value="${queryMap.phone}">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">电子邮箱</label>
                            <div class="layui-input-inline">
                                <input type="email" name="email" autocomplete="off" class="layui-input" value="${queryMap.email}">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <button type="submit" class="layui-btn layui-btn-primary"  lay-submit lay-filter="data-search-btn"><i class="layui-icon"></i> 搜 索</button>
                        </div>
                    </div>
                </form>
            </div>
        </fieldset>
        <!--批量删除用表单提交，只提交选中的元素-->
        <form action="${pageContext.request.contextPath}/customer" method="get"
              id="delForm">

            <input type="hidden" name="method" value="deleteByIds"/>

            <table class="table">
                <tr>
                    <td><input type="checkbox" id="allCheckedBtn"/> 全选/反选</td>
                    <td>客户编号</td>
                    <td>客户名称</td>
                    <td>身份证号</td>
                    <td>客户性别</td>
                    <td>城市</td>
                    <td>电话</td>
                    <td>电子邮箱</td>
                    <td>操作</td>
                </tr>
                <c:forEach items="${pageInfo.list}" var="c">
                <tr>
                    <td><input type="checkbox" class="checkedBtn" name="id" value="${c.id}"/></td>
                    <td>${c.id}</td>
                    <td>${c.name}</td>
                    <td>${c.idnumber}</td>
                    <td>${c.sex}</td>
                    <td>${c.city}</td>
                    <td>${c.phone}</td>
                    <td>${c.email}</td>
                    <td>
                        <input type="hidden" value="${c.id}"/>
                        <a href="javascript:;" class="btn btn-warning deleteBtn">删除</a>
                        <a href="javascript:;" class="btn btn-primary updateBtn">修改</a>
                    </td>
                </tr>
                </c:forEach>

                <tr>
                    <td colspan="6">
                        <a href="javascript:;" class="btn btn-success addBtn">添加雇员</a>
                        <a href="javascript:;" class="btn btn-danger delsBtn">批量删除选中的雇员</a>
                    </td>
                </tr>

            </table>
        </form>

        <div align="center">
            <!--分页-->
            <%@include file="/page/page.jsp"%>
            <%--<tr>
                <td colspan="6">

                    <a href="${pageContext.request.contextPath}/customer?method=showList&pageNo=${pageInfo.pageNum-1}&pageSize=${pageInfo.pageSize}&goodsName=${pMap.name}&minPrice=${pMap.minPrice}&maxPrice=${pMap.maxPrice}">上一页</a>

                    <c:forEach begin="1" end="${pageInfo.pages}" varStatus="status">

                        <a href="${pageContext.request.contextPath}/showCart?pageNo=${status.count}&pageSize=${pageInfo.pageSize}&goodsName=${pMap.name}&minPrice=${pMap.minPrice}&maxPrice=${pMap.maxPrice}"
                           <c:if test="${status.count == pageInfo.pageNum}">style="background-color: red"</c:if>

                        >${status.count}</a>
                    </c:forEach>

                    <a href="${pageContext.request.contextPath}/showCart?pageNo=${pageInfo.pageNum+1}&pageSize=${pageInfo.pageSize}&goodsName=${pMap.name}&minPrice=${pMap.minPrice}&maxPrice=${pMap.maxPrice}">下一页</a>

                </td>
            </tr>--%>
        </div>
    </div>
</div>

<!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
<script src="${pageContext.request.contextPath}/bootstrap/js/bootstrap.min.js" ></script>
<script>
    //页面加载时执行
    $(function () {
        //删除按钮
        $('.deleteBtn').click(function () {
                //弹出删除对话框
            if (confirm("确定删除吗，宝!")){
                location.href="${pageContext.request.contextPath}/customer?method=deleteCustomerById&id="+$(this).prev().val();
            }
        })

        //修改按钮
        $('.updateBtn').click(function () {
            location.href="${pageContext.request.contextPath}/customer?method=getCustomerById&id="+$(this).prev().prev().val();
        })

        //添加按钮
        $('.addBtn').click(function () {
            location.href="${pageContext.request.contextPath}/page/add.jsp"
        })

        //全选反选！！！！

        //如果全选反选按钮点击了，则将所有的class="checkedBtn"的按钮的checked属性值设置为全选反选按钮的checked属性值
        $('#allCheckedBtn').click(function () {
            $('.checkedBtn').prop("checked",$(this).prop("checked"))
        })

        //如果所有元素的按钮都选上了，则将全选反选的按钮也选上
        $('.checkedBtn').click(function () {
            if ($(this).prop('checked')){
                if ($('.checkedBtn').length==$('.checkedBtn:checked').length){
                    $('#allCheckedBtn').prop('checked',true);
                }else {
                    $('#allCheckedBtn').prop('checked',false);
                }
            }else {
                $('#allCheckedBtn').prop('checked',false);
            }
        })

        //批量删除！！
        $('.delsBtn').click(function () {
            if (confirm("兄第，这可是批量删除，别乱来！")){
                $('#delForm').submit();
            }
        })

    })
</script>
</body>
</html>
